import React, { useState } from 'react';
import axios from 'axios';
import './App.css';

const App = () => {
  const [username, setUsername] = useState('');
  const [password, setPassword] = useState('');
  const [isLoggedIn, setIsLoggedIn] = useState(false);

  const handleLogin = () => {
    // Отправка данных на сервер для аутентификации в формате JSON
    axios.post('http://127.0.0.1:8080/admin.login', {
        email: username,
        password: password
      }, {
        headers: {
          'Content-Type': 'application/json'
        }
      })
      .then(response => {
        // Если запрос успешен, устанавливаем статус входа в систему в true
        setIsLoggedIn(true);
        // Выводим сообщение об успешном входе
        alert('Успешный вход в систему!');
      })
      .catch(error => {
        // Обработка ошибок, например, вывод сообщения об ошибке
        console.error('Ошибка при аутентификации:', error);
      });
  };

  const handleLogout = () => {
    // Добавьте логику выхода из системы
    setIsLoggedIn(false);
  };

  return (
    <div>
      {isLoggedIn ? (
        <div>
          <h2>Добро пожаловать, {username}!</h2>
          <button onClick={handleLogout}>Выйти</button>
        </div>
      ) : (
        <div>
          <h2>Авторизация</h2>
          <div>
            <label>Имя пользователя:</label>
            <input
              type="text"
              value={username}
              onChange={(e) => setUsername(e.target.value)}
            />
          </div>
          <div>
            <label>Пароль:</label>
            <input
              type="password"
              value={password}
              onChange={(e) => setPassword(e.target.value)}
            />
          </div>
          <button onClick={handleLogin}>Войти</button>
        </div>
      )}
    </div>
  );
};

export default App;
